<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/module/index/_taglib.jsp" %>
<!DOCTYPE html>
<html>
	<head>
		<title>JC mms</title>
		<jsp:include page="/_loadCssScript.jsp"></jsp:include>
		<style type="text/css">
			/* 彩信帧预览 */
			#previewDiv {
				position: relative;
				height: 500px;
				width: 250px;
			}
			#smsBgDiv{
				background-color: #DEE3F6;
				height: 80%;
				width: 90%;
				top: 50px;
				left: 5%;
				position: absolute;
			}
			#phoneDiv{
				background: url("/jcmms/images/iphone5_s.png") no-repeat;
				width: 250px;
				height: 500px;
				position: absolute;
			}
			#contentDiv {
				top: 15%;
				left: 11%;
				width: 79%;
				height: 70%;
				position: absolute;
				overflow: auto;
				word-break: break-all;
				background-color: #DEE3F6;
			}
			#contentDiv img {
				max-width: 99%;
			}
		</style>
		<script type="text/javascript">
			$(function(){
				
			});
		</script>
	</head>
	<body>
		<jsp:include page="/module/index/_top_navbar.jsp"></jsp:include>
		
		<div class="container-fluid">
			<div class="row-fluid">
				<div class="span2">
					<jsp:include page="/module/index/_menu.jsp"></jsp:include>
				</div>
				<div class="span10">
					<!-- 站点路径 -->
					<ul class="breadcrumb">
						<li><a href="<%=request.getContextPath() %>/">首页</a> <span class="divider">/</span></li>
						<li><a href="javascript:void(0);">内容管理</a> <span class="divider">/</span></li>
						<li class="active">内容详情</li>
					</ul>
					
					<div class="row-fluid">
						<div class="span3">
							<fieldset>
								<legend>内容基本信息</legend>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">内容名称: </div>
									<div class="span9">${mms.name }</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">关键字: </div>
									<div class="span9">${mms.keyWord }</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">所属分类: </div>
									<div class="span9">${mms.contentCategoryId }</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">内容编号: </div>
									<div class="span9">${mms.number }</div>
								</div>
							</fieldset>
						</div>
						<div class="span3">
							<fieldset>
								<legend>内容详细信息</legend>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">彩信主题: </div>
									<div class="span9">${mms.mmsTopic }</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">彩信编号: </div>
									<div class="span9">${mms.mmsNumber }</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">回访URL地址: </div>
									<div class="span9">${mms.callbackUrl }</div>
								</div>
								<div class="row-fluid">
									<div class="span4" style="text-align: right;">URL地址所在帧: </div>
									<div class="span8">${mms.callbackUrlFrame }</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">发送日期: </div>
									<div class="span9"></div>
								</div>
							</fieldset>
						</div>
						<div class="span3">
							<fieldset>
								<legend>帧信息</legend>
								<input type="hidden" name="mmsId" value="${mmsId }"/>
								<input type="hidden" name="currentFrame" value="${currentFrame }"/>
								<input type="hidden" name="totalFrame" value="${totalFrame }"/>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">播放时间: </div>
									<div class="span9">${frame.playTime}</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">图片: </div>
									<div class="span9">${frame.imageUri}</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">铃音: </div>
									<div class="span9">${frame.audioUri}</div>
								</div>
								<div class="row-fluid">
									<div class="span3" style="text-align: right;">文字: </div>
									<div class="span9">${frame.text}</div>
								</div>
							</fieldset>
						</div>
						<div class="span3">
							<div id="previewDiv">
					    		<div id="smsBgDiv"></div>
					    		<div id="phoneDiv"></div>
					    		<div id="contentDiv"></div>
					    	</div>
							<button id="saveBtn" type="button" class="btn" data-loading-text="保存中...">保存</button>
						</div>
					</div>
				
					<div class="form-actions">
						<button id="saveBtn" type="button" class="btn btn-primary" data-loading-text="保存中...">保存</button>
					</div>
				</div>
			</div>
		</div>
		
		<div id="resultDialog" class="modal hide fade">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
				<span id="successLabel" class="label label-success">保存成功</span>
				<span id="failLabel" style="display: none;" class="label label-important">保存失败</span>
			</div>
			<div class="modal-body">
				<p></p>
			</div>
			<div class="modal-footer">
				<a href="#resultDialog" role="button" class="btn" data-toggle="modal">关闭</a>
				<a id="editFrameButton" href="#<%=request.getContextPath() %>/module/frame/toAdd.do" class="btn btn-primary">编辑帧</a>
			</div>
		</div>
	</body>
</html>